.bgs {
    width: 100%;
    min-width: 1366px;
    max-width: 1920px;
    height: 2030px;
}

.bg1 {
    width: 100%;
    height: 760px;

    background: url("../../image/intro_bg_01.jpg") no-repeat 50% 0;
}

.bg2 {
    width: 100%;
    height: 670px;

    background: url("../../image/intro_bg_02.jpg") no-repeat 50% 0;
}

.bg3 {
    width: 100%;
    height: 600px;

    background: url("../../image/intro_bg_03.jpg") no-repeat 50% 0;
}

.int1_title_sub {
    position: absolute;
    z-index: 15;
;
    top: 176px;
    left: 50%;

    width: 518px;
    height: 19px;
    margin-left: -259px;

    opacity: 1;
    background-position: 0 -150px;
}

.sp_int_title {
    background-image: url("../../image/sp_intro_title.png");
}

.int1_title_main {
    position: absolute;
    z-index: 15;
    top: 246px;
    left: 50%;

    width: 825px;
    height: 90px;
    margin-left: -417px;

    i {
        float: left;

        transition: .7s ease-in-out;
        text-indent: -10000px;

        opacity: 1;
        background-image: url("../../image/sp_intro_title.png");
    }
}

.int1_title_main-ua {
    width: 71px;
    height: 60px;
    margin: 0 2px;

    background-position: 0 0;
}

.int1_title_main-l {
    width: 7px;
    height: 61px;
    margin: 0 3px 0 2px;

    background-position: -300px 0;
}

.int1_title_main-s {
    width: 27px;
    height: 29px;
    margin: 30px 3px 0 2px;

    background-position: -190px -90px;
}

.int1_title_main-h {
    width: 29px;
    height: 60px;
    margin: 0 2px;

    background-position: -210px 0;
}

.int1_title_main-a {
    width: 30px;
    height: 28px;
    margin: 30px 3px 0 3px;

    background-position: 0 -90px;
}
.int1_title_main-b {
    width: 34px;
    height: 60px;
    margin: 0 2px;

    background-position: -90px 0;
}

.int1_title_main-e {
    width: 31px;
    height: 28px;
    margin: 30px 2px 0 2px;

    background-position: -50px -90px;
}

.int1_title_main-ui {
    width: 9px;
    height: 74px;
    margin: 0 2px;

    background-position: -380px 0;
}

.int1_title_main-p {
    width: 34px;
    height: 57px;
    margin: 30px 2px 0 2px;

    background-position: -330px 0;
}

.int1_title_main-r {
    width: 23px;
    height: 28px;
    margin: 30px 0 0 2px;

    background-position: -150px -90px;
}

.int1_title_main-o {
    width: 35px;
    height: 29px;
    margin: 30px 2px 0 2px;

    background-position: -100px -90px;
}

.int1_title_main-i {
    width: 12px;
    height: 46px;
    margin: 13px 0 0 4px;

    background-position: -260px 0;
}

.int1_title_main-d {
    width: 34px;
    height: 59px;
    margin: 0 2px;

    background-position: -150px 0;
}

.int1_title_main-dot {
    width: 37px;
    height: 8px;
    margin: 52px 2px 0 2px;

    background-position: -230px -110px;
}

.int1_desc {
    position: absolute;
    z-index: 15;
    top: 354px;
    left: 50%;

    width: 610px;
    height: 52px;
    margin-left: -305px;

    opacity: 1;
    background-position: 0 -200px;
}

.int1_title_main-blank_small {
    width: 13px;
    height: 30px;

    background-position: -350px -900px;
}

.int1_title_sub.active {
  animation: int1_title 2.3s ease-in-out;

  opacity: 1;
}
.int1_title_main.active i {
  transform: translate(0,0) !important;

  opacity: 1;
}
.int1_desc.active {
  animation: int1_desc 2.5s ease-in-out;

  opacity: 1;
}

@keyframes int1_title {
  0% {
      opacity: 0;
  }
  50% {
      opacity: 0;
  }
  100% {
      opacity: 1;
  }
}
@keyframes int1_desc {
  0% {
      opacity: 0;
  }
  50% {
      opacity: 0;
  }
  100% {
      opacity: 1;
  }
}